//let postUrl = "http://localhost:8080/";
 let postUrl = "http://22689vl275.iok.la/";
axios.defaults.withCredentials = true;

layui.use('layer', function () {
    var layer = layui.layer
});

//登录模块
let login = {
    template: `<div class="login_main">
        <fieldset class="layui-elem-field layui-field-title zyl_mar_02">
            <legend>欢迎登陆管理平台</legend>
        </fieldset>
        <div class="layui-row layui-col-space15">
            <div class="layui-form zyl_pad_01">
                <div class="layui-col-sm12 layui-col-md12">
                    <div class="layui-form-item">
                        <input type="text" lay-verify="required|userName" autocomplete="off"
                               placeholder="账号" class="layui-input" v-model="userName">
                        <i class="layui-icon layui-icon-username zyl_lofo_icon"></i>
                    </div>
                </div>
                <div class="layui-col-sm12 layui-col-md12">
                    <div class="layui-form-item">
                        <input type="password" lay-verify="required|pass" autocomplete="off"
                               placeholder="密码" class="layui-input" v-model="password">
                        <i class="layui-icon layui-icon-password zyl_lofo_icon"></i>
                    </div>
                </div>
                <div class="layui-col-sm12 layui-col-md12">
                    <button class="layui-btn" @click="sub()">登录</button>
                    <!--                    <button type="reset" class="layui-btn layui-btn-primary" @click="register()">注册</button>-->
                    <router-link class="layui-btn layui-btn-primary" tag="button" :to="{path:'/register'}">注册
                    </router-link>
                </div>
            </div>
        </div>
    </div>`,
    data() {
        return {
            userName: '',
            password: ''
        }
    },
    methods: {
        sub: async function () {
            let _vue = this;
            await axios.get(postUrl + 'user/login?username=' + this.userName + '&password=' + this.password).then(function (res) {
                if (res.data <= 0) {
                    layer.alert('登陆失败!')
                } else {
                    layer.alert('登陆成功!')
                    axios.get(postUrl + 'user/getUserInfo').then(function (res) {
                        let user = res.data;
                        localStorage.setItem('user', JSON.stringify(user));
                    });
                    setTimeout(function () {
                        _vue.$router.push('/index/productLineup')
                    }, 2000);

                }
            }).catch(function (error) {
                layer.alert('登陆失败!')
                console.log(error);
            });
        }
    }
};
//注册模块
let register = {
    template: `<div class="login_main" style="top: -300px">
        <fieldset class="layui-elem-field layui-field-title zyl_mar_02">
            <legend>注册</legend>
        </fieldset>
        <form class="layui-form" action="" @submit="sub">
            <div class="layui-row layui-col-space15 register-input">
                <div class="layui-form zyl_pad_01">
                    <div class="layui-col-sm12 layui-col-md12">
                        <div class="layui-form-item">
                            <i class="layui-icon layui-icon-username zyl_lofo_icon"></i>
                            <input type="text" lay-verify="required" autocomplete="off"
                                   placeholder="账号" class="layui-input" name="username">
                        </div>
                    </div>
                    <div class="layui-col-sm12 layui-col-md12">
                        <div class="layui-form-item">
                            <i class="layui-icon layui-icon-password zyl_lofo_icon"></i>
                            <input type="password" lay-verify="required" autocomplete="off"
                                   placeholder="密码" class="layui-input" name="password">
                        </div>
                    </div>
                    <div class="layui-col-sm12 layui-col-md12">
                        <div class="layui-form-item">
                            <i class="layui-icon layui-icon-note zyl_lofo_icon"></i>
                            <input type="text" lay-verify="required" autocomplete="off"
                                   placeholder="昵称" class="layui-input" name="name">
                        </div>
                    </div>
                    <div class="layui-col-sm12 layui-col-md12">
                        <div class="layui-form-item">
                            <i class="layui-icon layui-icon-cellphone  zyl_lofo_icon"></i>
                            <input type="text" autocomplete="off" lay-verify="required"
                                   placeholder="电话" class="layui-input" name="phone">
                        </div>
                    </div>
                    <div class="layui-col-sm12 layui-col-md12">
                        <div class="layui-form-item">
                            <i class="layui-icon layui-icon-username zyl_lofo_icon"></i>
                            <input type="text" lay-verify="required|pass" autocomplete="off" lay-verify="required"
                                   placeholder="身份证" class="layui-input" name="idcard">
                        </div>
                    </div>
                    <div class="layui-col-sm12 layui-col-md12">
                        <div class="layui-form-item">
                            <div class="layui-input-inline">
                                <i class="layui-icon layui-icon-circle zyl_lofo_icon"></i>
                                <select name="gender" lay-verify="required">
                                    <option value="">性别</option>
                                    <option value="男">男</option>
                                    <option value="女">女</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-sm12 layui-col-md12">
                        <div class="layui-form-item">
                            <div class="layui-input-inline">
                                <i class="layui-icon layui-icon-chat zyl_lofo_icon"></i>
                                <select name="role" lay-verify="required">
                                    <option value="">角色</option>
                                    <option value="采购员">采购员</option>
                                    <option value="销售员">销售员</option>
                                </select>
                            </div>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <button class="layui-btn">注册</button>
                            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>`,
    methods: {
        sub: function (e) {
            const _vue = this;
            const formData = new FormData(e.target);
            const value = {};
            for (let pair of formData.entries()) {
                value[pair[0]] = pair[1];
            }
            axios.post(postUrl + 'user/add', {
                username: value.username,
                password: value.password,
                name: value.name,
                phone: value.phone,
                idcard: value.idcard,
                gender: value.gender,
                role: value.role
            }).then(function (res) {
                if (!res.data <= 0) {
                    layer.alert('注册失败!')
                }
                layer.alert('注册成功!')
                _vue.$router.push({path: '/'})
            }).catch(function (error) {
                layer.alert('注册失败!')
            });
            e.preventDefault();
        }
    },
    mounted: function () {
        layui.use('form', function () {
            let form = layui.form;
            form.render();
        });
    }
}
//用户个人信息修改
let userUpdate = {
    template: `<div class="login_main" style="top: -300px">
        <fieldset class="layui-elem-field layui-field-title zyl_mar_02">
            <legend>修改</legend>
        </fieldset>
        <form class="layui-form" action="" @submit="sub">
            <div class="layui-row layui-col-space15 register-input">
                <div class="layui-form zyl_pad_01">
                    <div class="layui-col-sm12 layui-col-md12">
                        <div class="layui-form-item">
                            <i class="layui-icon layui-icon-username zyl_lofo_icon"></i>
                            <input type="text" lay-verify="required" autocomplete="off"
                                   placeholder="账号" class="layui-input" name="username" :value="user.username" >
                        </div>
                    </div>
                    <div class="layui-col-sm12 layui-col-md12">
                        <div class="layui-form-item">
                            <i class="layui-icon layui-icon-password zyl_lofo_icon"></i>
                            <input type="password" lay-verify="required" autocomplete="off"
                                   placeholder="密码" class="layui-input" name="password" :value="user.password">
                        </div>
                    </div>
                    <div class="layui-col-sm12 layui-col-md12">
                        <div class="layui-form-item">
                            <i class="layui-icon layui-icon-note zyl_lofo_icon"></i>
                            <input type="text" lay-verify="required" autocomplete="off"
                                   placeholder="昵称" class="layui-input" name="name" :value="user.name">
                        </div>
                    </div>
                    <div class="layui-col-sm12 layui-col-md12">
                        <div class="layui-form-item">
                            <i class="layui-icon layui-icon-cellphone  zyl_lofo_icon"></i>
                            <input type="text" autocomplete="off" lay-verify="required"
                                   placeholder="电话" class="layui-input" name="phone" :value="user.phone">
                        </div>
                    </div>
                    <div class="layui-col-sm12 layui-col-md12">
                        <div class="layui-form-item">
                            <i class="layui-icon layui-icon-username zyl_lofo_icon"></i>
                            <input type="text" lay-verify="required|pass" autocomplete="off" lay-verify="required"
                                   placeholder="身份证" class="layui-input" name="idcard" :value="user.idcard">
                        </div>
                    </div>
                    <div class="layui-col-sm12 layui-col-md12">
                        <div class="layui-form-item">
                            <div class="layui-input-inline">
                                <i class="layui-icon layui-icon-circle zyl_lofo_icon"></i>
                                <select name="gender" lay-verify="required">
                                    <option value="男">男</option>
                                    <option value="女">女</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <button class="layui-btn">修改</button>
                            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>`,
    async created() {
        this.user = await axios.get(postUrl + 'user/getUserInfo').then(function (res) {
            return res.data
        }).catch(function (error) {
            console.log(error);
        });
    },
    data() {
        return {
            user:{}
        }
    },
    methods: {
        sub: function (e) {
            const _vue = this;
            const formData = new FormData(e.target);
            const value = {};
            for (let pair of formData.entries()) {
                value[pair[0]] = pair[1];
            }
            axios.post(postUrl + 'user/update', {
                username: value.username,
                password: value.password,
                name: value.name,
                phone: value.phone,
                idcard: value.idcard,
                gender: value.gender,
				userNo: _vue.userNo
            }).then(function (res) {
                if (!res.data <= 0) {
                    layer.alert('修改失败!')
                }
                layer.alert('修改成功!')
                _vue.$router.push({path: '/'})
            }).catch(function (error) {
                layer.alert('修改失败!')
            });
            e.preventDefault();
        }
    },
    mounted: function () {
        layui.use('form', function () {
            let form = layui.form;
            form.render();
        });
    }
}



//商品列表
let productLineup = {
    template: `<div class="product-lineup">
        <button v-if="role == '管理员'" type="button" class="layui-btn layui-btn-normal" @click="addProductLineup">添加商品</button>
        <div class="layui-form">
            <table class="layui-table">
                <thead>
                <tr>
                    <th>序号</th>
                    <th>商品名称</th>
                    <th>商品编号</th>
                    <th>商品单价(/元)</th>
                    <th>备注</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                <tr v-for="(v,i) in product">
                    <td>{{i+1}}</td>
                    <td>{{v.name}}</td>
                    <td>{{v.productNo}}</td>
                    <td>{{v.price}}</td>
                    <td>{{v.remark}}</td>
                    <td style="width: 300px;">
                        <div style=" margin: 0 auto;">
                            <button v-if="role == '销售员'" type="button" class="layui-btn layui-btn-primary" @click="addCart(i)">添加到购物车
                            </button>
                            <button v-if="role == '管理员'" type="button" class="layui-btn" @click="edit(v.productNo)">编辑</button>
                            <button v-if="role == '管理员'" type="button" class="layui-btn layui-btn-danger" @click="de(v.productNo,i)">删除
                            </button>
                        </div>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>`,
    data() {
        return {
            role: JSON.parse(localStorage.getItem("user")).role,
            product: []
        }
    },
    async created() {
        this.product = await axios.get(postUrl + 'product/list').then(function (res) {
            return res.data.data
        }).catch(function (error) {
            console.log(error);
        });
    },
    methods: {
        addProductLineup: function (e) {
            this.$router.push({path: '/index/productLineup/add'})
        },
        edit: function (p) {
            this.$router.push({path: '/index/productLineup/see', query: {id: p}})
        },
        de: function (p,i) {
            let _vue = this;
            axios.get(postUrl + 'product/delete?productNo=' + p).then(function (res) {
                console.log(res.data)
                console.log(res.data >= 1)
                if (res.data >= 1) {
                    _vue.product.splice(p,1);
                    layer.alert('删除成功!');
                }else {
                    layer.alert('删除失败!');
                }
				window.location.reload();
            }).catch(function (error) {
                console.log(error)
                layer.alert('删除失败!')
            });
        },
        addCart: function (p) {
            let o = this.product[p];
            this.$router.push({
                path: '/index/productLineup/addCart',
                query: {productName: o.name, price: o.price, productNo: o.productNo}
            })
        }
    }
}
//修改商品信息模块
let productLineupSee = {
    template: `<div class="lineup-see" style="width: 300px; margin: 100px auto">
        <div class="layui-form-item">
            <label class="layui-form-label">id</label>
            <div class="layui-input-block">
                <input disabled type="text" name="title" autocomplete="off" placeholder="商品ID" class="layui-input"
                       v-model="obj.id">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">商品名称</label>
            <div class="layui-input-block">
                <input type="text" name="title" autocomplete="off" placeholder="商品名称" class="layui-input"
                       v-model="obj.name">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">商品编号</label>
            <div class="layui-input-block">
                <input type="text" name="title" autocomplete="off" placeholder="商品编号" class="layui-input"
                       v-model="obj.productNo">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">商品价格</label>
            <div class="layui-input-block">
                <input type="text" name="title" autocomplete="off" placeholder="商品价格" class="layui-input"
                       v-model="obj.price">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-block">
                <input type="text" name="title" autocomplete="off" placeholder="备注" class="layui-input"
                       v-model="obj.remark">
            </div>
        </div>
        <button style="margin-left: 120px" type="button" class="layui-btn layui-btn-warm"
                @click="update(obj.productNo)">修改
        </button>
        <button type="button" class="layui-btn" @click="back()">取消</button>

    </div>`,
    data() {
        return {
            obj: {
                id: null,
                name: '',
                productNo: '',
                price: '',
                remark: '',
            },
            name: '111'
        };
    },
    async created() {
        this.obj = await axios.get(postUrl + 'product/findProductByProductNo?productNo=' + this.$route.query.id).then(function (res) {
            let o = {};
            o.id = res.data.id;
            o.name = res.data.name;
            o.price = res.data.price;
            o.productNo = res.data.productNo;
            o.remark = res.data.remark;
            return o;
        }).catch(function (error) {
            console.log(error);
        });

    },
    methods: {
        update: function (p) {
            let _vue = this;
            axios.post(postUrl + 'product/update', {
                id: this.obj.id,
                name: this.obj.name,
                price: this.obj.price,
                productNo: this.obj.productNo,
                remark: this.obj.remark,
            }).then(function (res) {
                _vue.$router.push({path: '/index/productLineup'})
                layer.alert('修改成功!')
            }).catch(function (error) {
                layer.alert('修改失败!')
            });
        },
        back: function () {
            this.$router.go(-1);
        }
    }
}
//添加商品添加
let productLineupAdd = {
    template: `<div class="lineup-see" style="width: 300px; margin: 100px auto">
        <div class="layui-form-item">
            <label class="layui-form-label">商品名称</label>
            <div class="layui-input-block">
                <input type="text" name="title" autocomplete="off" placeholder="商品名称" class="layui-input"
                       v-model="obj.name">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">商品编号</label>
            <div class="layui-input-block">
                <input type="text" name="title" autocomplete="off" placeholder="商品编号" class="layui-input"
                       v-model="obj.productNo">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">商品价格</label>
            <div class="layui-input-block">
                <input type="text" name="title" autocomplete="off" placeholder="商品价格" class="layui-input"
                       v-model="obj.price">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-block">
                <input type="text" name="title" autocomplete="off" placeholder="备注" class="layui-input"
                       v-model="obj.remark">
            </div>
        </div>
        <button style="margin-left: 120px" type="button" class="layui-btn layui-btn-warm" @click="add(obj.productNo)">
            添加
        </button>
        <button type="button" class="layui-btn" @click="back()">取消</button>
    </div>`,
    data() {
        return {
            obj: {
                name: '',
                productNo: '',
                price: '',
                remark: '',
            },
        };
    },
    methods: {
        add: function () {
            let _vue = this;
            axios.post(postUrl + 'product/add', {
                name: this.obj.name,
                price: this.obj.price,
                productNo: this.obj.productNo,
                remark: this.obj.remark,
            }).then(function (res) {
                layer.alert('添加成功!')
                _vue.$router.push({path: '/index/productLineup'})
            }).catch(function (error) {
                layer.alert('添加失败!')
            });
        },
        back: function () {
            this.$router.go(-1);
        }
    }
}
//添加购物车模块
let addCart = {
    template: `<div class="lineup-see" style="width: 300px; margin: 100px auto">
        <div class="layui-form-item">
            <label class="layui-form-label">商品单价</label>
            <div class="layui-input-block">
                <input type="text" autocomplete="off" placeholder="商品单价" class="layui-input" disabled
                       v-model="price">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">商品名称</label>
            <div class="layui-input-block">
                <input type="text" autocomplete="off" placeholder="商品名称" class="layui-input" disabled
                       v-model="productName">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">商品编号</label>
            <div class="layui-input-block">
                <input type="text" autocomplete="off" placeholder="商品编号" class="layui-input" disabled
                       v-model="productNo">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">商品总价</label>
            <div class="layui-input-block">
                <input type="text" autocomplete="off" placeholder="商品总价" class="layui-input" disabled
                       v-model="total">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">商品数量</label>
            <div class="layui-input-block">
                <input type="text" autocomplete="off" lay-verify="required|number" placeholder="商品数量" class="layui-input"
                       v-model="count">
            </div>
        </div>
        <button style="margin-left: 120px" type="button" class="layui-btn layui-btn-warm" @click="addCart()">添加</button>
        <button type="button" class="layui-btn" @click="back()">取消</button>
    </div>`,
    data() {
        return {
            price: this.$route.query.price,
            count: '',
            productName: this.$route.query.productName,
            productNo: this.$route.query.productNo,
        }
    },
    created() {
        this.productName = this.$route.query.productName;
        this.productNo = this.$route.query.productNo;
    },
    methods: {
        addCart: function () {
            axios.post(postUrl + 'cart/add', {
                price: this.price,
                total: this.total,
                count: this.count,
                productName: this.productName,
                productNo: this.productNo,
            }).then(function (res) {
                if (res.data > 0) {
                    layer.alert('添加购物车成功!')
                } else {
                    layer.alert('添加购物车失败!')
                }
				history.back(-1);
            }).catch(function (error) {
                layer.alert('添加购物车失败!')
            });
        },
        back: function () {
            this.$router.go(-1);
        }
    },
    computed: {
        total: function () {
            return this.price * this.count;
        }
    }
}
//仓库列表
let inventoryList = {
    template: `<div>
        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
            <legend>库存添加</legend>
        </fieldset>
        <form class="layui-form" action="" @submit="sub">
            <div class="layui-form-item" style="width: 100%; min-width: 1024px" >
                <div class="layui-inline">
                    <div class="layui-input-inline" lay-filter="sel">
                        <select name="productNo" lay-verify="required" lay-search="">
                            <option value="">商品名称</option>
                            <option v-for="l in o" :value="l.productNo">{{l.name}}</option>
                        </select>
                    </div>
                </div>
                <div class="layui-inline">
                    <div class="layui-input-inline">
                        <input type="tel"placeholder="数量" name="num" lay-verify="required|number" autocomplete="off" class="layui-input">
                    </div>
                </div>
				<div class="layui-inline">
				    <div class="layui-input-inline">
				        <input type="tel"placeholder="收货人" name="buyer"  autocomplete="off" class="layui-input">
				    </div>
				</div>
				<div class="layui-inline">
				    <div class="layui-input-inline">
				        <input type="tel"placeholder="验货人" name="validator"  autocomplete="off" class="layui-input">
				    </div>
				</div>
				<div class="layui-inline">
				    <div class="layui-input-inline">
				        <input type="tel"placeholder="备注" name="remark"  autocomplete="off" class="layui-input">
				    </div>
				</div>
                <button type="submit" class="layui-btn layui-btn-normal">添加</button>
            </div>

        </form>
        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
            <legend>库存列表</legend>
        </fieldset>
        <table class="layui-table">
            <thead>
            <tr>
                <th>序号</th>
                <th>商品编号</th>
                <th>商品名称</th>
                <th>数量</th>
            </tr>
            </thead>
            <tbody>
            <tr v-for="(v,i) in obj">
                <td>{{i+1}}</td>
                <td>{{v.productNo}}</td>
                <td>{{v.productName}}</td>
                <td>{{v.num}}</td>
            </tr>
            </tbody>
        </table>
    </div>`,
    data() {
        return {
            obj: [],
            o: []
        }
    },
    async created() {
        let _vue = this;
        this.obj = await axios.get(postUrl + 'stock/list').then(function (res) {
            return res.data.data
        }).catch(function (error) {
            console.log(error);
        });
        await axios.get(postUrl + 'product/list').then(function (res) {
            _vue.o = res.data.data;
            setTimeout(function () {
                layui.form.render();//延迟重新渲染
            }, 10);
        }).catch(function (error) {
            console.log(error);
        });
    },
    methods: {
        sub: function (e) {
            const _vue = this;
            const formData = new FormData(e.target);
            const value = {};
            for (let pair of formData.entries()) {
                value[pair[0]] = pair[1];
            }
            axios.post(postUrl + 'stockIn/add', {
                productNo: value.productNo,
                num: value.num,
				buyer: value.buyer,
				validator: value.validator,
				remark: value.remark
            }).then(function (res) {
                if (res.data <= 0) {
                    layer.alert('添加失败!')
                }else {
                    layer.alert('添加成功!')
					window.location.reload();
                }
            }).catch(function (error) {
                layer.alert('添加失败!')
            });
            e.preventDefault();
        }
    },
    mounted: function () {
        layui.use('form', function () {
            let form = layui.form;
            form.render();
        });
    }
}
//购物车列表
let cartList = {
    template: `<div>
        <div class="layui-form">
            <table class="layui-table">
                <thead>
                <tr>
                    <th>序号</th>
                    <th>用户</th>
                    <th>单价</th>
                    <th>总价</th>
                    <th>数量</th>
                    <th>商品名字</th>
                    <th>商品编号</th>
                </tr>
                </thead>
                <tbody>
                <tr v-for="(v,i) in obj">
                    <td>{{i+1}}</td>
                    <td>{{v.buyer}}</td>
                    <td>{{v.price}}</td>
                    <td>{{v.total}}</td>
                    <td>{{v.count}}</td>
                    <td>{{v.productName}}</td>
                    <td>{{v.productNo}}</td>
                </tr>
                </tbody>
            </table>
            <button type="button" class="layui-btn layui-btn-primary" @click="add()">结算</button>
        </div>
    </div>`,
    data() {
        return {
            obj: [],
        }
    },
    async created() {
        this.obj = await axios.get(postUrl + 'cart/list').then(function (res) {
            return res.data.data
        }).catch(function (error) {
            console.log(error);
        });
    },
    methods: {
        add: function () {
			var remark=prompt("请输入备注");
            axios.get(postUrl + 'cart/settlement?remark='+remark).then(function (res) {
                layer.alert(res.data)
				setTimeout(function(){
					window.location.reload();
				},3000)
            }).catch(function (error) {
                console.log(error);
            });

        }
    }
}
//入库列表
let warehousingRecord = {
    template: `<div>
        <div class="layui-form">
            <table class="layui-table">
                <thead>
                <tr>
                    <th>序号</th>
                    <th>商品编号</th>
                    <th>商品名称</th>
                    <th>收货人</th>
                    <th>验货人</th>
                    <th>数量</th>
                    <th>入库时间</th>
                    <th>备注</th>
                </tr>
                </thead>
                <tbody>
                <tr v-for="(v,i) in obj">
                    <td>{{i+1}}</td>
                    <td>{{v.productNo}}</td>
                    <td>{{v.productName}}</td>
                    <td>{{v.buyer}}</td>
                    <td>{{v.validator}}</td>
                    <td>{{v.num}}</td>
                    <td>{{v.crateTime}}</td>
                    <td>{{v.remark}}</td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>`,
    data() {
        return {
            obj: []
        }
    },
    async created() {
        this.obj = await axios.get(postUrl + 'stockIn/list').then(function (res) {
            return res.data.data
        }).catch(function (error) {
            console.log(error);
        });
    },
}
//出库列表
let issueRecord = {
    template: `<div>
        <div class="layui-form">
            <table class="layui-table">
                <thead>
                <tr>
                    <th>序号</th>
                    <th>商品编号</th>
                    <th>商品名称</th>
                    <th>拿货人</th>
                    <th>验货人</th>
                    <th>数量</th>
                    <th>出库时间</th>
                    <th>备注</th>
                </tr>
                </thead>
                <tbody>
                <tr v-for="(v,i) in obj">
                    <td>{{i+1}}</td>
                    <td>{{v.productNo}}</td>
                    <td>{{v.productName}}</td>
                    <td>{{v.getter}}</td>
                    <td>{{v.vilidator}}</td>
                    <td>{{v.num}}</td>
                    <td>{{v.createTime}}</td>
                    <td>{{v.remark}}</td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>`,
    data() {
        return {
            obj: []
        }
    },
    async created() {
        this.obj = await axios.get(postUrl + 'stockOut/list').then(function (res) {
            return res.data.data
        }).catch(function (error) {
            console.log(error);
        });
    },
	
}
//用户列表
let userRecord = {
    template: `<div>
        <div class="layui-form">
            <table class="layui-table">
                <thead>
                <tr>
                    <th>序号</th>
                    <th>账号</th>
                    <th>用户密码</th>
                    <th>角色</th>
					 <th>用户名称</th>
					  <th>电话</th>
					   <th>性别</th>
					    <th>身份证</th>
					<th>操作</th>
                </tr>
                </thead>
                <tbody>
                <tr v-for="(v,i) in obj">
                    <td>{{i+1}}</td>
                    <td>{{v.username}}</td>
                    <td>{{v.password}}</td>
                    <td>{{v.role}}</td>
					<td>{{v.name}}</td>
					<td>{{v.phone}}</td>
					<td>{{v.gender}}</td>
					<td>{{v.idcard}}</td>
                    <td><button @click="deleteUser(v.userNo)">删除</button></td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>`,
    data() {
        return {
            obj: []
        }
    },
    async created() {
        this.obj = await axios.get(postUrl + 'user/list').then(function (res) {
            return res.data.data
        }).catch(function (error) {
            console.log(error);
        });
    },
	methods: {
	    deleteUser: function (userNo) {
	        axios.get(postUrl + 'user/delete?userNo='+userNo).then(function (res) {
	            layer.alert("删除成功");
				window.location.reload();
	        }).catch(function (error) {
	            console.log(error);
	        });
	
	    }
	}
}




//主要模块
let home = {
    template: `<div class="layui-layout-body">
        <div class="layui-layout layui-layout-admin">
            <div class="layui-header">
                <div class="layui-logo">超市进销存系统</div>
                <ul class="layui-nav layui-layout-right">
                    <li class="layui-nav-item">
                        <a href="javascript:;">
                            <img class="layui-nav-img">
                            {{userName}}
                        </a>
                    </li>
                    <li class="layui-nav-item" @click="out()"><a href="">退了</a></li>
                </ul>
            </div>
            <div class="layui-side layui-bg-black">
                <div class="layui-side-scroll">
                    <ul class="layui-nav layui-nav-tree" lay-filter="test">
                        <li class="layui-nav-item" v-for="v in menu">
                            <router-link :to="{ path: v.link }" tag="a">{{v.name}}</router-link>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="layui-body">
                <div style="padding: 15px;">
                    <router-view/>
                </div>
            </div>
        </div>
    </div>`,
    data() {
        return {
            userName: '',
            role: '',
            menus: [
                {
                    name: '商品列表',
                    link: '/index/productLineup',
                }, {
                    name: '库存列表',
                    link: '/index/inventoryList',
                }, {
                    name: '购物车',
                    link: '/index/cartList',
                }, {
                    name: '入库记录',
                    link: '/index/warehousingRecord',
                }, {
                    name: '出库记录',
                    link: '/index/issueRecord',
                }, {
                    name: '用户管理',
                    link: '/index/userRecord',
                }, {
                    name: '用户修改',
                    link: '/index/userUpdate',
                }
            ],
            menu: []
        }
    },
    methods:{
        out:async function () {
            await axios.get(postUrl + 'user/logout').then(function (res) {
                console.log(res.data)
            });
            layer.alert('退出成功!');
            console.log(1)
            localStorage.removeItem("user");
            this.$router.push({path: '/'})
        }
    },
    created() {
        let user = JSON.parse(localStorage.getItem("user"))
        if(user.role == "管理员"){
            this.menu.push(this.menus[0]);
            this.menu.push(this.menus[1]);
            this.menu.push(this.menus[3]);
            this.menu.push(this.menus[4]);
			this.menu.push(this.menus[5]);
			this.menu.push(this.menus[6]);
        }
        if(user.role == "采购员"){
            this.menu.push(this.menus[1]);
            this.menu.push(this.menus[3]);
			this.menu.push(this.menus[6]);
        }
        if(user.role == "销售员"){
            this.menu.push(this.menus[0]);
            this.menu.push(this.menus[2]);
			this.menu.push(this.menus[6]);
        }

        this.userName = user.username;
    },
    mounted: function () {
        layui.use('element', function () {
            let element = layui.element;
        });
    }
}
//路由
const router = new VueRouter({
    routes: [{
        path: '/',
        name: login,
        component: login
    },
        {
            path: '/index',
            component: home,
            beforeEnter: (to, from, next) => {
                if(localStorage.getItem("user") == null){
                    next('/');
                }
                next();
            },
            children: [{
                path: 'productLineup',
                component: productLineup,
            }, {
                path: 'inventoryList',
                component: inventoryList
            }, {
                path: 'cartList',
                component: cartList
            }, {
                path: 'warehousingRecord',
                component: warehousingRecord
            }, {
                path: 'issueRecord',
                component: issueRecord
            }, {
                path: 'userRecord',
                component: userRecord
            }, {
                path: 'userUpdate',
                component: userUpdate
            }, {
                path: 'productLineup/see',
                component: productLineupSee
            }, {
                path: 'productLineup/add',
                component: productLineupAdd
            }, {
                path: 'productLineup/addCart',
                component: addCart
            }]
        }, {
            path: '/register',
            name: register,
            component: register
        }
    ]
})

let vm = new Vue({
    el: "#root",
    router
});
